/*
Devices
==========================================
Contains device specific classes to handle content on different viewports.

######The viewport classes:
`.device--mobile`<br/>
`.device--tablet`<br/>
`.device--tablet-portrait`<br/>
`.device--tablet-landscape`<br/>
`.device--desktop`<br/>
*/

.device--mobile { display: block; }
.device--tablet { display: none; }
.device--tablet-portrait { display: none; }
.device--tablet-landscape { display: none; }
.device--desktop { display: none; }

@media screen and(min-width: @tabletViewportWidth) {
    .device--mobile { display: none; }
    .device--tablet { display: block; }
    .device--tablet-portrait { display: block; }
    .device--tablet-landscape { display: none; }
    .device--desktop { display: none; }
}

@media screen and(min-width: @tabletLandscapeViewportWidth) {
    .device--mobile { display: none; }
    .device--tablet { display: block; }
    .device--tablet-portrait { display: none; }
    .device--tablet-landscape { display: block; }
    .device--desktop { display: none; }
}

@media screen and (min-width: @desktopViewportWidth) {
    .device--mobile { display: none; }
    .device--tablet { display: none; }
    .device--tablet-portrait { display: none; }
    .device--tablet-landscape { display: none; }
    .device--desktop { display: block; }
}